<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/index.css">
</head>
<body>
<h1>欢迎使用xxx管理系统</h1>
<hr>
<h2>用户列表</h2>
<hr>
<button onclick="location.href='add.html'">添加用户</button>
<table>
    <thead>
    <tr>
        <th>ID</th>
        <th>用户名</th>
        <th>年龄</th>
        <th>邮箱</th>
    </tr>
    </thead>
    <tbody>
    </tbody>
</table>


<script src="js/jquery-3.7.1.min.js"></script>
<script>
    //加载文档
    $(function () {
        //发送网络请求，请求服务端数据
        $.get('user/list', function (data) {
            $.each(data, (i, user) => {
                $('tbody').append(`<tr>
                                        <td>${user.id}</td>
                                        <td>${user.name}</td>
                                        <td>${user.age}</td>
                                        <td>${user.email}</td>
                                   </tr>
                `)
            })
        })
    })
</script>
</body>
</html>
